import { Tabs, ConfigProvider } from "antd";
import type { TabsProps } from "antd";
import "./App.css";

import HtBoard from "@/pages/ht-board/ht-board";
import HtConfig from "@/pages/ht-config/ht-config";
import HtModify from "@/pages/ht-config/ht-modify"; // 后台数据修改
import QtIndex from "@/pages/qt-index/qt-index";

//准备国际化
import zhCN from "antd/locale/zh_CN";
// for date-picker i18n
import "dayjs/locale/zh-cn";

const items: TabsProps["items"] = [
  { key: "1", label: "初始化", children: <HtBoard /> },
  { key: "2", label: "数据存入", children: <HtConfig /> },
  { key: "3", label: "数据修改", children: <HtModify /> },
  { key: "4", label: "前台展示", children: <QtIndex /> },
];

function App() {
  return (
    <>
      <ConfigProvider locale={zhCN}>
        <Tabs
          defaultActiveKey="1" //默认选中第二个标签页
          items={items}
          indicator={{ size: (origin) => origin - 20, align: "start" }}
        />
      </ConfigProvider>
    </>
  );
}

export default App;
